<template>
  <div>
    <h1>watchEffect</h1>
   <div>水温:{{ temp }}</div>
   <div>水位:{{ height }}</div>
   <button @click="changeTemp">水温+10</button>
   <button @click="changeHeight">水位+10</button>
  </div>
</template>
<script lang="ts" setup name="Person">
import { ref, watch,watchEffect } from "vue";
let temp =ref(0)
let height =ref(0)
function changeTemp(){
  temp.value +=10
}
function changeHeight(){
  height.value +=10
}
// watch监视
// const stopWatch=watch([temp,height],(value)=>{
//   let [newTemp,newHeight]=value
//   if(newTemp>60||newHeight>100){
//     console.log("向服务器发送请求");
//   }
// })
// 使用watchEffect
watchEffect(()=>{
  if(temp.value>=30||height.value>=20){
    console.log("向服务器发送请求");
  }
})
</script>
<style>

</style>